<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:c="http://java.sun.com/jstl/core"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich">
      
      <ui:composition template="/templates/frontEnd/inicial.xhtml">
      	<ui:define name="shopBody">	
      		<h:form>
      			<div id="shop-body">
					<div class="slideshow">
						<h:graphicImage value="Imagens/img-teste1.jpg" height="300" width="800" />
						<h:graphicImage value="Imagens/img-teste2.jpg" height="300" width="800" />
						<h:graphicImage value="Imagens/img-teste3.jpg" height="300" width="800" />
					</div>
					<br/>
					<h:graphicImage value="Imagens/barra-destaque.jpg"/>
					<br/>
					<rich:dataGrid id="grid-index" value="#{bbProduct.products}" var="prod" columns="3" elements="3">
            			<rich:panel styleClass="rich-panel-width">
                			<f:facet name="header">
                    			<h:outputText value="#{prod.categories[0].name}" />
                			</f:facet>
                			<h:panelGrid columns="1">
                				<h:graphicImage value="/ProductImage/#{prod.images[0].description}" />
                    			<h:outputText value="Nome: #{prod.name}" />
                    			<h:outputText value="Preço: #{prod.price}" />
                    			<h:commandButton value="Ver" action="algo">
                    				<f:setPropertyActionListener value="#{prod}" target="#{bbProduct.product}" />
                    			</h:commandButton>
                			</h:panelGrid>
            			</rich:panel>
        			</rich:dataGrid>
        			<rich:datascroller for="grid-index" />
				</div>
			</h:form>		
    	</ui:define>
	</ui:composition>
</html>